<style>
.page{
	background: #f8f8f8;
	width: 100%;
	height: 100%;
}
.tab{
	height: 75rpx;
	line-height: 75rpx;
	width: 100%;
}
.tab view{
	height: 100%;
	width: 33%;
	text-align: center;
	font-size: 30rpx;
	float: left;
}
.tab_current{
	border-bottom: 4rpx solid #f47a7a;
	height: 100%;
	display: inline-block;
}
.entrust-box{
	background: #fff;
	width: 100%;
	height: 100%;
	margin-bottom: 10rpx;
}
.entrust-list{
	width: 90%;
	margin: 0 auto;
	height: 100%;
	overflow: hidden;
}
.entrust{
	height: 270rpx;
}
.entrust-head{
	height: 74rpx;
	line-height: 74rpx;
	width: 100%;
	overflow: hidden;
	border-bottom: 2rpx solid #e6e6e6;
}
.entrust-head text{
	font-size: 28rpx;
	overflow: hidden;
	height: 100%;
}
.entrust-orderno{
	float: left;
	width: 75%;
}
.entrust-status{
	width: 25%;
	float: right;
	font-size: 28rpx;
	text-align: right;
}
.entrust-info{
	height: 147rpx;
	width: 100%;
	margin-top: 24rpx;
}
.entrust-image{
	height: 147rpx;
	width: 147rpx;
	float: left;
	margin-right: 24rpx;
}
.entrust-goods{
	width: 505rpx;
	height: 147rpx;
	overflow: hidden;
	float: left;
}
.goods-name{
	text-overflow:ellipsis;
	white-space: nowrap;
	width: 485rpx;
	height: 46rpx;
	line-height: 46rpx;
	font-size: 30rpx;
}
.goods-price{
	font-size: 30rpx;
	color: #4c4c4c;
}
.status-botton{
	height: 51rpx;
	border: 2rpx solid #808080;
	width: 136rpx;
	border-radius: 5rpx;
	text-align: center;
	line-height: 51rpx;
	color: #808080;
	font-size: 28rpx;
	float: right;
}
</style>
<template>
	<view class="page">
		<view class="tab">
			<view>
				<text class="tab_current">已发起</text>
			</view>
			<view>
				<text class="">待通过</text>
			</view>
			<view>
				<text>已收款</text>
			</view>
		</view>
		<view class="entrust-box">
			<view class="entrust-list">
				<view class="entrust">
					<view class="entrust-head">
						<text class="entrust-orderno">订单号：1111111111111111</text>
						<text class="entrust-status">已发起</text>
					</view>
					<view class="entrust-info">
						<image src="../../static/images/red-price.png" mode="" class="entrust-image"></image>
						<view class="entrust-goods">
							<view class="goods-name">商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称</view>
							<view class="goods-price">￥10000</view>
							<view class="status-botton">
								取消委托
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="entrust-box">	
			<view class="entrust-list">
				<view class="entrust">
					<view class="entrust-head">
						<text class="entrust-orderno">订单号：1111111111111111</text>
						<text class="entrust-status">已发起</text>
					</view>
					<view class="entrust-info">
						<image src="../../static/images/red-price.png" mode="" class="entrust-image"></image>
						<view class="entrust-goods">
							<view class="goods-name">商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称</view>
							<view class="goods-price">￥10000</view>
							<view class="status-botton">
								取消委托
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>	
			
		</view>
	</view>
</template>

<script>
</script>
